<script setup>
import { useRoute,useRouter } from 'vue-router';
import { ElMessage,ElMessageBox  } from 'element-plus';
import { getCourseList } from '@/api/Member/index.js'
const props = defineProps({
    uuid:{
        default:"",
        type:[String,Number]
    }
})

const seachTable = ref(null);
const route = useRoute();
const router = useRouter();
const instance = getCurrentInstance();

// 新增编辑回退时候刷新列表
onActivated(()=>{

})
const formInline = ref([

])

const btnLefts = ref([
])
const btnRights = ref([
])

const tableConfig = ref([
    {
      prop: "courseName",
      label: "疗程名称",
      width:200
    },
    {
      prop: "content",
      label: "疗程内容",
      width:450,
      type:"slot",
      slotName:"content"
    },
    {
      prop: "useNum",
      label: "剩余次数",
      width:250
    },

    {
      prop: "totalNum",
      label: "疗程总次数",
      width:200,
      format:(value,row)=>{
        let useNum = row.useNum || 0;
        let usedNum = row.usedNum || 0;
        return  Number(useNum) + Number(usedNum);
      }
    },
    {
      prop: "expireDateStr",
      label: "到期日期",
      width:200,
       
    },
    {
      prop: "status",
      label: "状态",
      width:100,
      format:(value,row)=>{
        return ["未生效","生效中","已过期","已失效"][value] || '-';
      }
    },
    {
      prop: "orderNo",
      label: "订单编号",
      type:"slot",
      slotName:"orderNo"
    },
]);
const tableLoading = ref(false)
const totalPage = ref(0)
const tableData = ref([]);


const handlerSearch = async (formInline)=>{
    tableLoading.value = true;
    try{
        let params = {
            ...formInline,
            memberId:props.uuid
        };
        let result = await getCourseList(params);
        console.log(result,222);
        totalPage.value = Number(result.total);
        tableData.value = result.records;
        tableLoading.value = false;
    }catch(e){
        tableLoading.value = false;
    }
}


</script>
<template>
    <div class="page-content">
        <SeachTable 
          :tableType="1"
          ref="seachTable"
          :forms="formInline"
          :btnLefts="btnLefts"
          :btnRights="btnRights"
          :tableLoading="tableLoading"
          :tableConfig="tableConfig"
          :tableData="tableData"
          :totalPage="totalPage"
          @handlerSearch="handlerSearch"
          :showLine="false"
          :showBtn="false"
        >
            <template #content="{ row }">
                <div class="text-info">{{ row.courseProjectContext }}；</div>
                <div class="text-info" style="margin-top:5px">{{ row.courseProductContext }}；</div>
            </template>
            <template #orderNo="{ row }">
                <div class="a-link">{{ row.orderNo }}</div>
            </template>
        </SeachTable>
    </div>
</template>
<style lang="less" scoped>
.a-link{
    color:#3480FF;
    font-size: 14px;
    cursor: pointer;
}
:deep(.search-line){
    padding:0;
}
:deep(.search-table .table){
    padding:0;
}
.text-info{
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    color: #222222;
}
</style>